import { ref, onMounted } from "vue";
import { getDishes } from "@/apis/dishApi.js";
import { onBeforeRouteUpdate, useRoute } from "vue-router";

export function useDish() {
    const route = useRoute();
    const dishList = ref([]);


    const param=ref({
        categoryId:""
    })

    // 获取菜品列表数据
    const getDishList = async (id = route.params.id) => {
        param.value.categoryId=id
        const res = await getDishes(param.value);
        console.log(res.data);
        dishList.value = res.data;
        console.log("dishList", dishList.value);
    };

    // 组件挂载时获取数据
    onMounted(() => getDishList());

    // 路由参数变化时重新获取数据
    onBeforeRouteUpdate((to) => {
        getDishList(to.params.id);
    });

    return {
        dishList
    };
}
